<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/main.css">
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script type="text/javascript">
$(function(){	
	$(".car-img").click(function(){
		var offset = $(this).offset();
		var p=$(window).scrollTop();
		$(".alert-form-box").css("top",offset.top-100-p);
		$('#alertModal').modal('show');
	})
	
	$(".alert-item:eq(0)").click(function(){
		location.href='DailyLease.html';
	})
	$(".alert-item:not(:first)").click(function(){
		$('#myModal').modal({
		  backdrop: "static"
		})
	})
	
	$("#closeModal").click(function(){
		$('#myModal').modal('hide');
	})
	
	
})
</script>
</head>
<body>
<div class="main-box" style="padding-top:200px;">
<div class="navbar-fixed-top">
  <div class="nav-box">
    <div class="nav-left"><a href="CityTime.jsp"><img src="images/btn_back.png" height="40"></a></div>
    <div class="nav-center">选择车型</div>
    <div class="nav-right">&nbsp;</div>
    <div class="clear"></div>
  </div>
  <div class="orderCarTime-box">
  	<dl><dt><img src="images/icon_take.png" width="20"></dt>
    <dd>上海 2014-06-11 13:00</dd></dl> <div class="clear"></div>
    <dl><dt><img src="images/icon_return.png" width="20"></dt>
    <dd>上海 2014-06-11 13:00</dd></dl> <div class="clear"></div>
    <div class="small-icon">
    	<div><img src="images/t1.png" width="16" height="16"> 含基本险</div>
        <div><img src="images/t2.png" width="16" height="16"> 无手续费</div>
        <div><img src="images/t3.png" width="16" height="16"> 不限里程</div>
    </div>
  </div>
  <div class="cartype-title-box">
  	<div class="cartype-title-left"><img src="images/cartype_title_left.png" width="167" height="40"></div>
    <div class="cartype-title-right"><img src="images/cartype_title_right.png" width="134" height="40"></div>
    <div class="clear"></div>
  </div>
</div>

  
  <ul class="cartype-list">
  <li>
  <div class="car-img"><img src="images/35.png" width="100"><div class="rent"><img src="images/rent.png" width="76"></div></div>
  <div class="car-desc"><div class="car-name">日产阳光</div><div class="car-author">预授权：3500元</div><div class="car-text">自排/3厢/5座</div></div>
  <div class="car-order">
  <div class="car-price">￥99</div>
  <div><a href="Favorable.html"><img src="images/order.png" height="30"></a></div>
  </div>
  <div class="clear"></div>  
  <hr class="line"/></li>
  <li>
  <div class="car-img"><img src="images/35.png" width="100"><div class="rent"><img src="images/rent.png" width="76"></div></div>
  <div class="car-desc"><div class="car-name">日产阳光</div><div class="car-author">预授权：3500元</div><div class="car-text">自排/3厢/5座</div></div>
  <div class="car-order">
  <div class="car-price">￥99</div>
  <div><a href="ChangeCarShop.html"><img src="images/full.png" height="30"></a></div>
  </div>
  <div class="clear"></div>  
  <hr class="line"/></li>
   <li>
  <div class="car-img"><img src="images/35.png" width="100"><div class="rent"><img src="images/rent.png" width="76"></div></div>
  <div class="car-desc"><div class="car-name">日产阳光</div><div class="car-author">预授权：3500元</div><div class="car-text">自排/3厢/5座</div></div>
  <div class="car-order">
  <div class="car-price">￥99</div>
  <div><a href="Favorable.html"><img src="images/order.png" height="30"></a></div>
  </div>
  <div class="clear"></div>  
  <hr class="line"/></li>
  <li>
  <div class="car-img"><img src="images/35.png" width="100"><div class="rent"><img src="images/rent.png" width="76"></div></div>
  <div class="car-desc"><div class="car-name">日产阳光</div><div class="car-author">预授权：3500元</div><div class="car-text">自排/3厢/5座</div></div>
  <div class="car-order">
  <div class="car-price">￥99</div>
  <div><a href="ChangeCarShop.html"><img src="images/full.png" height="30"></a></div>
  </div>
  <div class="clear"></div>  
  <hr class="line"/></li>
   <li>
  <div class="car-img"><img src="images/35.png" width="100"><div class="rent"><img src="images/rent.png" width="76"></div></div>
  <div class="car-desc"><div class="car-name">日产阳光</div><div class="car-author">预授权：3500元</div><div class="car-text">自排/3厢/5座</div></div>
  <div class="car-order">
  <div class="car-price">￥99</div>
  <div><a href="Favorable.html"><img src="images/order.png" height="30"></a></div>
  </div>
  <div class="clear"></div>  
  <hr class="line"/></li>
  <li>
  <div class="car-img"><img src="images/35.png" width="100"><div class="rent"><img src="images/rent.png" width="76"></div></div>
  <div class="car-desc"><div class="car-name">日产阳光</div><div class="car-author">预授权：3500元</div><div class="car-text">自排/3厢/5座</div></div>
  <div class="car-order">
  <div class="car-price">￥99</div>
  <div><a href="ChangeCarShop.html"><img src="images/full.png" height="30"></a></div>
  </div>
  <div class="clear"></div>  
  <hr class="line"/></li>
   <li>
  <div class="car-img"><img src="images/35.png" width="100"><div class="rent"><img src="images/rent.png" width="76"></div></div>
  <div class="car-desc"><div class="car-name">日产阳光</div><div class="car-author">预授权：3500元</div><div class="car-text">自排/3厢/5座</div></div>
  <div class="car-order">
  <div class="car-price">￥99</div>
  <div><a href="Favorable.html"><img src="images/order.png" height="30"></a></div>
  </div>
  <div class="clear"></div>  
  <hr class="line"/></li>
  <li>
  <div class="car-img"><img src="images/35.png" width="100"><div class="rent"><img src="images/rent.png" width="76"></div></div>
  <div class="car-desc"><div class="car-name">日产阳光</div><div class="car-author">预授权：3500元</div><div class="car-text">自排/3厢/5座</div></div>
  <div class="car-order">
  <div class="car-price">￥99</div>
  <div><a href="ChangeCarShop.html"><img src="images/full.png" height="30"></a></div>
  </div>
  <div class="clear"></div>  
  <hr class="line"/></li>
   <li>
  <div class="car-img"><img src="images/35.png" width="100"><div class="rent"><img src="images/rent.png" width="76"></div></div>
  <div class="car-desc"><div class="car-name">日产阳光</div><div class="car-author">预授权：3500元</div><div class="car-text">自排/3厢/5座</div></div>
  <div class="car-order">
  <div class="car-price">￥99</div>
  <div><a href="Favorable.html"><img src="images/order.png" height="30"></a></div>
  </div>
  <div class="clear"></div>  
  <hr class="line"/></li>
  <li>
  <div class="car-img"><img src="images/35.png" width="100"><div class="rent"><img src="images/rent.png" width="76"></div></div>
  <div class="car-desc"><div class="car-name">日产阳光</div><div class="car-author">预授权：3500元</div><div class="car-text">自排/3厢/5座</div></div>
  <div class="car-order">
  <div class="car-price">￥99</div>
  <div><a href="ChangeCarShop.html"><img src="images/full.png" height="30"></a></div>
  </div>
  <div class="clear"></div>  
  <hr class="line"/></li>
  </ul>
</div>
<!--弹出框-->
<div class="modal fade" id="alertModal">
<div class="alert-form-box">
    <div class="alert-item">
    	<div class="img"><img src="images/calendar2.png" width="30"/></div>
    	<div class="text">&nbsp;<br/>每日租金</div>
    </div>
    <div class="alert-item">
    	<div class="img"><img src="images/gift.png" width="30"/></div>
    	<div class="text">5天<br/>以上更优惠</div>
    </div>
    <div class="alert-item">
    	<div class="img"><img src="images/gift.png" width="30"/></div>
    	<div class="text">15天<br/>以上更优惠</div>
    </div>
</div>
</div>
<div class="modal fade" id="myModal">
<div class="alert-box">
	<div class="alert-title">
    优惠信息
    </div>
    <div class="alert-content">
   	  <div class="alert-img"><img src="images/gift.png" width="60" height="59" /></div>
      <div class="alert-msg"><span style="color:#ff0000;">5</span>天以上价格，立减<span style="color:#ff0000;">8</span>元/天</div>
      <div class="alert-button" id="closeModal">
        返 回
      </div>

    </div>
</div>
</div>
<!--弹出框结束-->
</body>
</html>
